import Navbar from "./pages/Navbar";
import { BrowserRouter as Router, Route, Switch, Redirect } from "react-router-dom"
import Home from "./pages/Home";
import Login from "./pages/Login";
import Register from "./pages/Register";
import Flash from "./pages/Flash"
import Personal from "./pages/Personal"
import Antd from '@pages/Antd'
import WebSoc from './pages/WebSoc'
import 'antd/dist/antd.css';
import Auth from './utils/isAuth'
import {useEffect, useState} from 'react'
import { useSelector } from "react-redux";
const App = () => {
  const [isLogin, setIsLogin] = useState(true)
  const res = useSelector(state => state.login.isAuth)
  useEffect(() => {
    setIsLogin(res)
  }, [res])
  return (
    <Router>
      <Navbar />
      <Flash />
      <Switch>
        <Route exact path="/" render={() => <Redirect to="/home" />} />
        <Route exact path="/home" render={() => <Home /> } />
        <Route path="/login" component={Login} />
        <Route path="/register" component={Register} />
        <Route path="/Personal" render={() => isLogin ? <Personal /> : <Redirect to="/login" />} />
        {/* <Route path="/Personal" component={Auth(Personal)} /> */}
        <Route path="/antd" component={Antd} />
        <Route path="/websoc" component={WebSoc} />

      </Switch>
    </Router>
  );
}

export default App;
